<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>绑定用户</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />

    <link rel="stylesheet" href="AmazeUI-2.4.2/assets/css/amazeui.css" />
    <link href="css/dlstyle.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="plugins/vue/dist/vue.min.js"></script>
    <script type="text/javascript" src="plugins/axios/dist/axios.min.js"></script>
    <script type="text/javascript" src="./js/common.js"></script>
</head>
<body>
<div class="login-boxtitle">
    <a href="home.html"><img alt="logo" src="images/logobig.png"/></a>
</div>
<div class="login-banner" id="app">
    <div class="login-main">
        <div class="login-banner-bg"><span></span><img src="images/big.jpg"/></div>
        <div class="login-box">
            <h3 class="title">绑定用户</h3>
            <div class="clear"></div>
            <div class="login-form">
                <form>
                    <div class="user-name">
                        <label for="user"><i class="am-icon-user"></i></label>
                        <input type="text" name="" v-model="loginForm.username" id="user"
                               placeholder="邮箱/手机/用户名">
                    </div>
                    <div class="user-pass">
                        <label for="password"><i class="am-icon-lock"></i></label>
                        <input type="password" name="" v-model="loginForm.password" id="password"
                               placeholder="请输入密码">
                    </div>
                </form>
            </div>
            <div class="am-cf">
                <input type="button" @click="binding" name="" value="绑定" class="am-btn am-btn-primary am-btn-sm">
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    new Vue({
        el:"#app",
        data:{
            loginForm:{
                username:'',
                password:'',
                openid:''
            }
        },
        methods:{
            binding(){
                if(!this.loginForm.username){
                    alert("账号不能为空");
                    return;
                }
                if(!this.loginForm.password){
                    alert("密码不能为空");
                    return;
                }
                let partm = getRequest();
                console.debug("绑定参数",partm);
                this.loginForm.openid = partm.openid;
                this.$http.post("/wechat/binding",this.loginForm).then(( res=> {
                    console.debug(res);
                    let {msg,success,result} = res.data;
                    if(res.data.success){
                        //把登录用户存储到本地浏览器
                        localStorage.setItem("loginUser", JSON.stringify(result.loginUser));
                        //把token储到本地浏览器
                        localStorage.setItem("token",result.token);
                        location.href="index.html"
                    }else {
                        alert(msg)
                    }
                }));
            }
        }
    })
</script>
</html>